<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>享送小哥</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
</head>

<body>
    <div class="aui-content">
        <header class="aui-bar aui-bar-nav aui-bar-light u-aui-bar">
            <a class="aui-pull-left aui-btn" onclick="javascript:api.closeWin();"> <span class="aui-iconfont aui-icon-left"></span> </a>
            <div class="aui-title u-aui-title">快捷登入</div>
        </header>
        <div class="aui-content aui-margin-b-15">
            <div class="login-t1">为了方便自由快递人联系您，请验证手机</div>
            <ul class="aui-list aui-form-list aui-form-list2">
                <li class="aui-list-item aui-padded-l-5">
                    <div class="aui-list-item-inner">
                        <div class="aui-list-item-label-icon"> <i class="aui-iconfont aui-icon-mobile"></i> </div>
                        <div class="aui-list-item-input">
                            <input placeholder="请输入手机号码" type="tel" class="u-inp1" maxlength="11" v-model="phone">
                        </div>
                    </div>
                </li>
                <li class="aui-list-item aui-padded-l-5">
                    <div class="aui-list-item-inner bor-bn">
                        <div class="aui-list-item-label-icon"> <i class="aui-iconfont aui-icon-lock2"></i> </div>
                        <div class="aui-list-item-input aui-padded-r-0">
                            <input placeholder="请输入验证码" type="text" class="u-inp1 u-inp2" maxlength="6" v-model="code">
                            <input class="code-btn aui-btn" value="发送验证码" type="button" @click="sms">
                        </div>
                    </div>
                </li>
            </ul>
            <div class="logon-zc aui-margin-b-15 aui-margin-t-15">
                <!-- <input id="checkbox_a1" class="chk_1" checked="" type="checkbox">
                <label for="checkbox_a1"><span class="reg-ty">同意<a href="" class="blue">《注册服务条款》</a></span></label> -->
                <a href="javascript:;" class="fr c-9" @click="pwdLogin">密码登录</a></div>
            <input class="aui-btn aui-btn-info login-sub1" value="登入" @click="login">
        </div>
    </div>
    <!--js-->
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/vue.js"></script>
    <script type="text/javascript" src="../script/app.js"></script>
    <!--验证码-->
    <script type="text/javascript">
        apiready = function() {
            app.statusBar.set();
        }
        new Vue({
            el: ".aui-content",
            data: {
                phone: "",
                code: ""
            },
            methods: {
                sms: function(e) {
                    var that = this,
                        btn = e.target;
                    if (this.phone == "") {
                        app.error("请输入手机号！");
                        return false;
                    }
                    app.request.post('Common/sms', {
                        phone: that.phone,
                        type: "101"
                    }, {}, function(res) {
                        if (res.code == 200) {
                            settime(btn);
                        } else {
                            app.error(res.message);
                        }
                    })
                },
                login: function() {
                    if (this.phone == "") {
                        app.error("请输入手机号！");
                        return false;
                    } else if (this.code == "") {
                        app.error("请输入验证码！");
                        return false;
                    } else {

                        app.request.post('Client/login', {
                            type: 'sms',
                            phone: this.phone,
                            code: this.code
                        }, {}, function(res) {
                            if (res.code == 200) {
                                app.loginSuccess(res, function() {});
                                api.closeWin();
                            } else {
                                app.error(res.message);
                            }
                        });

                        // app.api.smsLogin(this.phone, this.code, function(res) {
                        //     api.closeWin();
                        // });
                    }
                },
                pwdLogin: function() {
                    app.page({
                        name: "login",
                        url: "./login.html"
                    })
                }
            }
        })
        var countdown = 60;

        function settime(obj) {
            if (countdown == 0) {
                obj.removeAttribute("disabled");
                obj.value = "发送验证码";
                obj.style.background = "#2db3ff";
                countdown = 60;
                return;
            } else {
                obj.setAttribute("disabled", true);
                obj.value = "重新发送(" + countdown + ")";
                obj.style.background = "#E1E1E1";
                countdown--;
            }
            setTimeout(function() {
                settime(obj)
            }, 1000)
        }
    </script>
</body>

</html>
